<template>
    <view class="calendar-page">
        <calendar :is-show="true"  :start-date="startDate" :end-date="endDate" mode="2"  @callback="getDate" />
		<view class="page-bottom">
			<uni-goods-nav class="uni-goods-nav" :fill="true" :options="options" :buttonGroup="buttonGroup"  @buttonClick="buttonClick" />
		</view>
    </view>
</template>
<script>
    import Calendar from '@/mall_subpages/components/mobile-calendar-simple/Calendar.vue'
	import { dateFtt } from '@/utils/tools.js'
    export default {
        data(){
            return {//日期均为yyyy-mm-dd或者yyyy/mm/dd格式
                startDate:'',
                endDate:'',
                betweenStart:'',
                betweenEnd:'',
				// 底部菜单按钮配置
				buttonGroup: [
					{text: '确认选择', backgroundColor: '#007aff',color: '#fff', type:2},
				],
				options: []
            }
        },
		onLoad(props) {
			let dateDetail = JSON.parse(decodeURIComponent(props.dateDetail))
			console.log("dateDetail",dateDetail)
			let startStr = dateDetail?.startStr?.dateStr
			let endStr = dateDetail?.endStr?.dateStr
			console.log("数据",startStr,endStr)
			this.startDate = dateFtt("yyyy-MM-dd",new Date(startStr))
			this.endDate = dateFtt('yyyy-MM-dd',new Date(endStr))
		},
        methods:{
            //获取回调的日期数据
            getDate(date){
				this.$api.prePage().setDateList({date,type:2})
            },
			buttonClick() {
				uni.navigateBack()
			}
        },
        components:{
            Calendar
        }
    }
</script>
<style scoped lang="scss">
	.calendar-tz.fixed {
		top: var(--window-top);
		
	}
	
	.calendar-page {
		:v-deep .content {
			.con:last-child {
				margin-bottom: 200rpx;
			}
		}
	}
	
	/* 底部操作菜单 */
	.page-bottom{
		position:fixed;
		z-index: 999;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 100rpx;
		background: rgba(255,255,255,1);
		.uni-goods-nav {
			width: 100%;
		}
	}
	
</style>